<script lang="ts" setup>
import type { FormInstance, FormRules } from 'element-plus'
import { defineEmits, defineProps } from "vue";
const props = defineProps({
  data: {
    type: Object,
    required: true
  }
})
const emit = defineEmits(["concel"]);
const ruleFormRef = ref<FormInstance>()
const rules = ref<FormRules>({
  tourStaff: [
    { required: true, message: '请选择巡检人员', trigger: 'change' }
  ]
})
const formData = ref<any>({
  tourStaff: '',
  operateDateStart: '',
  operateDateEnd: ''
})
const staffList = ref<any>([
  {
    code: '1',
    name: '张三'
  },
  {
    code: '2',
    name: '李四'
  }
])
async function addSubmit() {
  ruleFormRef.value && ruleFormRef.value.validate(async (valid: any) => {
    if (valid) {
      console.log(formData.value)
      handleConcel(true)
    }
  })
}

function handleConcel(isResh: boolean) {
  emit("concel", isResh);
}

</script>

<template>
  <div>
    <el-form
    ref="ruleFormRef"
    :model="formData"
    label-position="right"
    label-width="100px"
    :rules="rules"
    :disabled="props.viewType === 'view'"
>
      <el-row :gutter="20">
        <el-col :span="24">
          <el-form-item label="选择人员" prop="tourStaff">
            <el-select v-model="formData.tourStaff" clearable>
              <el-option v-for="item in staffList" :key="item.code" :label="item.name" :value="item.code" />
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="24" style="text-align: center">
          <el-button @click="handleConcel(false)">取消</el-button>
          <el-button type="primary" @click="addSubmit">确定</el-button>
        </el-col>
      </el-row>
    </el-form>
  </div>
</template>
<style lang='scss' scope></style>
